<style type="text/css">
<!--
.maincolumn2 {
    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2); 
    overflow: hidden;
    width: 760px;
}

.info-area .form-area {
    background: none repeat scroll 0 0 #FFFFFF;
    border: 0 solid #D9D9D9;
    padding: 25px 0 10px;
}

.show-btn {
    background: url("http://master.assets.dajieimg.com.d/up/resume/images/edit-btn.gif") no-repeat scroll 0 -26px rgba(0, 0, 0, 0);
    color: #333333;
    float: right;
    height: 26px;
    line-height: 26px;
    padding-left: 25px;
    width: 40px;
}

.hide-btn {
    background: url("http://master.assets.dajieimg.com.d/up/resume/images/edit-btn.gif") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    color: #333333;
    float: right;
    height: 26px;
    line-height: 26px;
    padding-left: 25px;
    width: 40px;
}

-->
</style>
<script type="text/javascript">
	 //添加 编辑 删除事件
    $('.J_event').live('click', function(e) {
    	//alert("add!");
        e.preventDefault();
        var _tr = $(this).parents('tr'),
                itemType = $(this).attr('itemtype'),
                $info = $('#' + itemType + '-info'),
                itemId = $(this).attr('itemid');
        if (!$(this).hasClass('disable')) {
            switch ($(this).attr('rel')) {
                case 'edit':
                    editEvent(itemType, itemId, _tr);
                    resumeMask($(this));
                    break;
                case 'del':
                    if (confirm('确定要删除吗')) {
                        delEvent($(this), itemType, itemId)
                    }
                    break;
                case 'add':
                    addEvent($(this), itemType);
                    break;
                case 'show':
                	showEvent($(this),itemType);
                	break;
            }
        }
    });
	
//显示或  隐藏
function showEvent($this,itemType)
{
	if($("#hide_div_"+itemType).is(":hidden"))
	{
		$("#hide_div_"+itemType).attr("style","display:block");
		$this.children().html("收缩");
		$this.attr("class","hide-btn J_event");
	}else
	{
		$("#hide_div_"+itemType).attr("style","display:none");
		$this.children().html("展开");
		$this.attr("class","show-btn J_event");
	}
	
} 

//页面加载时隐藏添加按钮

function hiddenAddBtn($addBtn){
    $addBtn.each(function(){
        var $this= $(this),
            itemType = $this.attr('itemtype'),
            $info =$('#' + itemType + '-info'),
            maxNum =$this.attr('maxnum'),
            listNum = $info.find('.table-list > tr').length;
        if($info.find('.insert-tr').length > 0){
            listNum =$info.find('.table-list > tr').length -1
        }
        if(listNum>=maxNum){
            $this.hide();
            $info.parents('.mask-area').find('.include-tip').hide();
        }else{
            $this.show();
            $info.parents('.mask-area').find('.include-tip').show();
        }
    });
    $('.J_event,.J_editBase').each(function(e) {
            $(this).removeClass('disable');
        });
}


//添加事件通用函数
function addEvent($this,itemType) {
    var $info = $('#' + itemType + '-info'),
        maxNum = $this.attr('maxnum'),
        listNum = $info.find('.table-list tr').length;
    if(itemType != 'itskill' && itemType != 'cert'){
        if(listNum>=maxNum){
            alert('最多可填加'+maxNum+'项');
            return false;
        }
    }
    $this.hide();
    resumeMask($this);
    $info.addClass('hidden');

    switch(itemType){
        case 'practice':
            $.ajax({
                type:'post',
                url:'/invitation/practice_create',
                data:{type:1,mobile:'${invitationApply.mobile}'},
                success:function(r) {
                    $info.before(r);
                    $info.addClass('hidden').hide();
                    //resumeMask($info);
                    $('.textarea-con').each(function() {
                        textareaCheck($(this))
                    });
                    return
                },
                error:function() {
                    errorFun();
                }
            });
        break;
         
        default:
            $.ajax({
                type:'post',
                url:'/invitation/' + itemType + '_create',
                data:{mobile:'${invitationApply.mobile}'},
                success:function(r) {
                    $info.before(r);
                    $info.addClass('hidden').hide();
                    //resumeMask($info);
                    setTimeout(function() {
                        var $form = $('#form-' + itemType);
                        if (itemType != 'edu') {
                            validataCheck($form, itemType)
                        }
                        /*$('.textarea-con').each(function() {
                            textareaCheck($(this))
                        });*/
                    }, 100);
                },
                error:function() {
                    ajaxError()
                }
            });
    }

}



//编辑状态下其它模块蒙板  $this 事件按钮
function resumeMask($this) {
    $('.mask-area').each(function(i) {
        var h = $(this).height(),w = $(this).width(),$_this = $(this);
        $_this.addClass('locked');
        if(!$_this.find('.resume-masking').length){
            $_this.append($('<div class="resume-masking"></div>'))
            $_this.find('.resume-masking').height(h).width(w);
            }
    });
    var itemType= $this.attr('itemtype'),
        $btn =$('.J_event[rel="add"][itemtype="' + itemType + '"]');
    $('.J_event,.J_editBase').each(function() {
        $(this).addClass('disable');
    });
    $btn.hide();
    $this.parents('.mask-area').removeClass('locked');
    $this.parents('.mask-area').find('.include-tip').hide()
}

//所有ajax  error
function ajaxError() {
     alert('服务器繁忙，刷新后重试')
}



$('.J_cancel').live('click', function() {
        var itemType = $(this).attr('itemtype'),
                $info = $('#' + itemType + '-info'),
                $btn = $('.J_event[rel="add"][itemtype="' + itemType + '"]');
        cancelMask();
        if(itemType == 'itskill' || itemType == 'cert'){
            $btn = $(this).parents('.mask-area').find('h3 .J_event');
            removeDialog(itemType)
        }
        hiddenAddBtn($btn)
        $info.removeClass('hidden');
        //$(this).parents('.info-area').find('.hidden').show();
        $info.show();
        $(this).parents('.insert-tr').remove();
        $(this).parents('.form-area').remove();
        /*if ($info.find('.table-list tr').length == $btn.attr('maxnum')) {
            $btn.hide();
            $info.parents('.mask-area').find('.include-tip').hide();
        }*/
    });
    
 
//textarea 验证交互  当前字数/最大字数
function textareaCheck($this) {
    var $box = $this.parent('.textarea-box'),
        maxNum =$this.attr('maxnum'),
        tipWidth = $this.outerWidth(),
        defaultVal =$this.attr('blankvalue');
    $box.find('.textarea-check-tip').width(tipWidth)
    if($this.val() == defaultVal){
        var val = 0;
    }else{
        val = $.formValidate.textReplace($this.val());
        $this.addClass('show')
    }
    var len = $.formValidate.textLength($.formValidate.textReplace(val));
    $box.find('.J_lastNum span').text(len);
    if (len > maxNum) {
        $box.find('.J_lastNum span').addClass('red');
    } else {
        $box.find('.J_lastNum span').removeClass('red');
    }
}


function cancelMask() {
    $('.mask-area').each(function() {
        $(this).removeClass('locked');
        $(this).find('.resume-masking').remove();
        $(this).find('.include-tip').show()
    });
    $('.J_editBase').each(function() {
            $(this).removeClass('disable').show();
        });
}


function removeDialog(dialogType){
    if(dialogType == 'itskill'){
        $('#interactive-box-master-dialog').remove();
        $('#interactive-box-familiar-dialog').remove();
    }else{
        $('#interactive-box-'+dialogType+'-dialog').remove();
    }

}


//提交成功返回对象，提取html插入页面
function formSubmit($form,itemType) {
    $form.ajaxSubmit({
        success:function(r) {
            var result = eval('(' + r + ')'),
                $btn = $('.J_event[rel="add"][itemtype="' + itemType + '"]'),
                $info = $('#' + itemType + '-info');
            if (result.statusCode == 0) {
                //resultForm(itemType, result.data);
                $info.empty().html(result.data).removeClass('hidden').show();
                //loadLayout();
                cancelMask();
                $('#' + itemType + '-form').remove();
                if(itemType == 'cert' || itemType == 'itskill'){
                    $btn = $('.J_event[itemtype="' + itemType + '"]'),
                    editBtnSwitch(itemType); //编辑按钮显示控制
                    hiddenAddBtn($btn)
                }else{
                    hiddenAddBtn($btn);//添加按钮显示控制
                }
                removeDialog(itemType)
            } else {
                alert(result.msg);
            }
        }
    });

}   
    

//重载边栏简历完成度
function loadLayout() {
        $.ajax({
            url:'http://job.dajie.com/resume/layout/frag',
            type:"POST",
            success:function (r) {
                $('.sidecolumn').html(r);
            }
        });
    }



//form submit validatacheck
function validataCheck($form,itemType) {
    var $checks = $('.J_checkInput '),
            $btnO = $('#J_formSubmit'),
            flag = true;
    $checks.formValidate();
    $checks.focus(function () {
        $(this).parents('td.input').find('.error').hide();
        $(this).removeClass('textarea-error');
    }).click(function(){
        $(this).parents('td.input').find('.error').hide();
        $(this).removeClass('textarea-error');
    });
    $('.text').focus(function() {
        $(this).parents('td.input').find('.error').hide();
    });
    $('.textarea-con').each(function() {
                            textareaCheck($(this))
                        });
    $btnO.click(function (e) {
        e.preventDefault();
        $checks.each(function () {
            var e = $.formValidate.check(this);
            if (!e) {
                if(this.nodeName == 'TEXTAREA'){
                    $(this).addClass('textarea-error')
                }
                $(this).parents('td.input').find('.error').show();
                $(this).parents('td.input').find('.queryout').remove();
            }
        });
        if ($.formValidate.check()) {
			$checks.each(function(){
				var $this = $(this);
				var blankValue = $this.attr('blankvalue');
				if(blankValue && blankValue == $this.val()){
					$this.val('');
				}
			});
            formSubmit($form,itemType)
        }
    });
}    


//编辑事件通用函数
function editEvent(itemType, itemId, _tr){
    switch (itemType) {
        case 'practice':
            ajaxEvent(itemType, itemId,_tr,'4');
            break;
        case 'intern':
            ajaxEvent(itemType, itemId,_tr,'4');
            break;
        case 'edu':
            ajaxEvent(itemType, itemId,_tr,'5');
            break;
        case 'lang':
            ajaxEvent(itemType, itemId,_tr,'5');
            break;
        case 'project':
            ajaxEvent(itemType, itemId,_tr,'4');
            break;
        case 'training':
            ajaxEvent(itemType, itemId,_tr,'3');
            break;
        case 'position':
            ajaxEvent(itemType, itemId,_tr,'4');
            break;
        case 'scholarship':
            ajaxEvent(itemType, itemId,_tr,'4');
            break;
        case 'offer':
            ajaxEvent(itemType, itemId,_tr,'5');
            break;
        case 'other':
            ajaxEvent(itemType, itemId,_tr,'3');
            break;
        case 'affix':
            ajaxEvent(itemType, itemId,_tr,'3');
            break;
        case 'itskill':
            var $this = $('.J_event[rel="edit"][itemtype="' + itemType + '"]');
            addEvent($this,itemType)
            break;
        case 'cert':
            var $this = $('.J_event[rel="edit"][itemtype="' + itemType + '"]');
            addEvent($this,itemType)
            break;

    }
}


//pickpad 反回值重新生成新样式  it技能、证书
function result(item,maxNum) {
          var text = $('#' + item + '-input').attr('title').split(" + "),
                  textArray = [];
          if (text.length == 1 && text[0] == "") {
              text = [];
          }
          for (i = 0; i < text.length; i++) {
              textArray.push(text[i]);
          }
    var Residual = maxNum - textArray.length
    $('#' + item + '-result').empty();
          for (i = 0; i < textArray.length; i++) {
              if (textArray.length == 0) {
                  return
              } else {
                  var _html = '<a href="javascript:void(0);" class="ticket"><span class="text">' + textArray[i] + '</span><span class="delete">删除</span></a>';
                  $('#' + item + '-result').append(_html).show();
              }
          }
    if(Residual > 0){
        if($('#' + item + '-result').find('.sheng').length){
            $('#' + item + '-result').find('.sheng').text('可再选'+Residual+'项')
        }else{
            var lastHtml ='<em class="sheng">可再选'+Residual+'项</em>';
            $('#' + item + '-result').append(lastHtml);
        }
        }
      }

//pickpad result delete  证书，技能等
function deleteDate($this, name,defaultText,maxNum) {
          var $item = $this.parents('.ticket'),
                  itemIndex = $item.index(),
                  $hidden =$('#'+name+'-hidden'),
                  $input =$('#'+name+'-input'),
                  idsArray = $hidden.val().split(','),
                  textArray = $input.attr('title').split('+');
          $item.remove();
          //textArray.splice(itemIndex, 1);
          idsArray.splice(itemIndex, 1);
          var newIds = idsArray.join(',');
    /*      var newText =textArray.join('+'),
              newIds = idsArray.join(',');
    */
          //$input.val(newText);
    //console.log(newIds)
          $hidden.val(newIds);
          var $list = $('#' + name + '-result a.ticket');
          var Residual = maxNum - $list.length;
          if ($list.length == 0) {
              $('#'+name+'-result').text(defaultText);
          }else{
              if($('#' + name + '-result').find('.sheng').length){
                  $('#' + name + '-result').find('.sheng').text('可再选'+Residual+'项')
              }else{
                  var lastHtml ='<em class="sheng">可再选'+Residual+'项</em>';
                  $('#' + name + '-result').append(lastHtml);
              }
          }

      }

//添加&编辑按钮切换
function editBtnSwitch(itemType){
    var listNum = $('#' + itemType + '-info').find('.table-list tr').length;
    if(listNum == 0){
        $('.J_event[rel="edit"][itemtype="' + itemType + '"]').addClass('add-btn').text('添加').removeClass('edit-btn').attr('rel','add')
    }else{
        $('.J_event[rel="add"][itemtype="' + itemType + '"]').attr('rel','edit').addClass('edit-btn').text('编辑').removeClass('add-btn')
    }

}




//删除函数
function delEvent($this,itemType, itemId) {
    switch(itemType){
        case 'practice':
                  $.ajax({
                url:'/invitation/practice/' + itemId + '/delete',
                type:"POST",
                data:{type:1,mobile:'${invitationApply.mobile}'},
                success:function (r) {
                    var _data = $.parseJSON(r);
                    if(_data.statusCode == 0){
                        var $info =$('#' + itemType + '-info'),
                            $btn =$('.J_event[rel="add"][itemtype="' + itemType + '"]');
                        $info.removeClass('hidden').empty().html(_data.data).show();
                        loadLayout();
                        hiddenAddBtn($btn);
                    }else{
                        alert(_data.msg)
                    }
                }
            });
        break;
        case 'intern':
            $.ajax({
                url:'/invitation/practice' + '/' + itemId + '/delete',
                type:"POST",
                data:{type:3,mobile:'${invitationApply.mobile}'},
                success:function (r) {
                    var _data = $.parseJSON(r);
                    if (_data.statusCode == 0) {
                        var $info = $('#' + itemType + '-info'),
                                $btn = $('.J_event[rel="add"][itemtype="' + itemType + '"]');
                        $info.removeClass('hidden').empty().html(_data.data).show();
                        loadLayout();
                        hiddenAddBtn($btn);
                    } else {
                        alert(_data.msg)
                    }
                }
            });
        break;
        default:
            $.ajax({
                url:'/invitation/' + itemType + '/' + itemId + '/delete',
                type:"POST",
                data:{type:3,mobile:'${invitationApply.mobile}'},
                success:function (r) {
                    var _data = $.parseJSON(r);
                    if (_data.statusCode == 0) {
                        var $info = $('#' + itemType + '-info'),
                                $btn = $('.J_event[rel="add"][itemtype="' + itemType + '"]');
                        $('#' + itemType + '-form').remove();
                        $info.removeClass('hidden').empty().html(_data.data).show();
                        loadLayout();
                        hiddenAddBtn($btn);
                    } else {
                        alert(_data.msg)
                    }
                }
            })
    }
}
;

</script>
		<#-- basic -->
        <div class="maincolumn2 border-bottom">
            <div class="item-section">
                <div class="mask-area">
                    <h3>
                        <span class="b f14">基本信息</span>
                    </h3>
                    <div class="item-bd">
                        <div class="info-area clearfix" id="base-info">
                            <#include "edit_resume/form_base.ftl">
                        </div>
                    </div>
                </div>
            </div>
            <#-- practice -->
            <div class="item-section">
                <div class="mask-area">
                    <h3>
                        <a href="#"  class="add-btn J_event" itemType="practice" rel="add" maxnum="10"> 添加 </a><span class="b f14">工作经历</span>
                    </h3>
                    <div class="item-bd">
                        <div id="practice-info" class="info-area">
                    		<#include "edit_resume/frag_practice.ftl">
                        </div>
                    </div>
                </div>
            </div> 
            <#-- edu -->
            <div class="item-section">
                <div class="mask-area">
                    <h3>
                        <a href="#"  class="add-btn J_event" itemType="edu" rel="add" maxnum="10"> 添加 </a><span class="b f14">教育经历</span>
                    </h3>
                    <div class="item-bd">
                        <div id="edu-info" class="info-area">
                    		<#include "edit_resume/frag_edu.ftl">
                        </div>
                    </div>
                </div>
            </div>
             
            <#--证书及专业技能↓展开   ↑收缩-->
            <div class="item-section">
                <div class="mask-area">
                    <h3>
                        <a href="#"  class="show-btn J_event" itemType="itskills" rel="show" ><span>展开</span></a><span class="b f14">证书及专业技能</span>
                    </h3>
                    <div class="item-bd" style="display:none" id="hide_div_itskills">
                        <div id="edu-info" class="info-area">
                    		 <#-- <#include "common/form_itskill.ftl"> -->
                    		 <table width="100%" class="dj-form-base">
						        <colgroup>
						            <col width="120">
						            <col width="*">
						        </colgroup>
						        <tbody> 
							        <tr>
							        	<th></th>
							            <td style="padding-bottom:10px;" class="input textarea-box" colspan="3">
							                <textarea blanksubmit="true" reg="^.{0,400}$" id="itskillsDesc" name="itskillsDesc" blankValue="描述你所获得的语言类证书，专业证书以及所学专业相关技能（限400字）" blankclass="g9"  class="textarea-con g9" style="width:420px;height:70px;font-size:12px" maxnum="400"><#if (invitationApply)?? && invitationApply.itskillsDesc??>${invitationApply.itskillsDesc}</#if></textarea>
							                <p class="textarea-check-tip"><span class="J_lastNum g9"><span>0</span>/400</span></p>
							            </td>
							        </tr>
						        </tbody>
						    </table> 
                        </div>
                    </div>
                </div>
            </div>
            <#-- self evaluation -->
            <div class="item-section">
                <div class="mask-area">
                    <h3>
                        <a href="#"  class="show-btn J_event" itemType="self" rel="show"  ><span>展开</span></a><span class="b f14">个人评价</span>
                    </h3>
                    <div class="item-bd" style="display:none" id="hide_div_self">
                        <div id="edu-info" class="info-area">
                    		<#-- <#include "common/form_self.ftl"> -->
                    		 <table width="100%" class="dj-form-base">
						        <colgroup>
						            <col width="120">
						            <col width="*">
						        </colgroup>
						        <tbody> 
							        <tr>
							        	<th></th>
							            <td style="padding-bottom:10px;" class="input textarea-box" colspan="3">
							                <textarea blanksubmit="true" reg="^.{0,400}$" id="selfEvaluation" name="selfEvaluation" blankValue="用简要的语言描述您个人的优缺点。" blankclass="g9"  class="textarea-con g9" style="width:420px;height:70px;font-size:12px" maxnum="400"><#if (invitationApply)?? && invitationApply.selfEvaluation??>${invitationApply.selfEvaluation}</#if></textarea>
							                <p class="textarea-check-tip"><span class="J_lastNum g9"><span>0</span>/400</span></p>
							            </td>
							        </tr>
						        </tbody>
						    </table> 
                        </div>
                    </div>
                </div>
            </div>
          
        </div> 

<script type="text/javascript">
    $(function(){
        hiddenAddBtn($('.J_event[rel="add"]'));
        
        var itskillTips = "描述你所获得的语言类证书，专业证书以及所学专业相关技能（限400字）"
        var selfTips = "用简要的语言描述您个人的优缺点。（限400字）"
        $("#itskillsDesc").html(itskillTips);
        $("#selfEvaluation").html(selfTips);
        
        $("#itskillsDesc").focus(function(){
                if($("#itskillsDesc").val() == itskillTips)
                {
                        $("#itskillsDesc").html("");
                }
                $("#itskillsDesc").attr("class","textarea-con show focus");
        })

        $("#itskillsDesc").blur(function(){
                if($("#itskillsDesc").val() == "")
                {
                        $("#itskillsDesc").html(itskillTips);
                        $("#itskillsDesc").attr("class","textarea-con g6");
                }
        })


        $("#selfEvaluation").focus(function(){
                if($("#selfEvaluation").val() == selfTips)
                {
                        $("#selfEvaluation").html("");
                }
                $("#selfEvaluation").attr("class","textarea-con show focus");
        })
        $("#selfEvaluation").blur(function(){
                if($("#selfEvaluation").val() == "")
                {
                        $("#selfEvaluation").html(selfTips);
                        $("#selfEvaluation").attr("class","textarea-con g6");
                }
        })

    })

</script>

    <#macro modelname name><#if name ='edu'>
        <#assign modelName = '教育经历'/>
    <#elseif name ='lang'>
        <#assign modelName = '语言能力'/>
    <#elseif name ='cert'>
        <#assign modelName = '证书'/>
    <#elseif name ='itskill'>
        <#assign modelName = 'IT技能'/>
    <#elseif name ='project'>
        <#assign modelName = '项目经验'/>
    <#elseif name ='training'>
        <#assign modelName = '培训经历'/>
    <#elseif name ='practice'>
        <#assign modelName = '工作经历'/>
    <#elseif name ='intern'>
        <#assign modelName = '实习经历'/>
    <#elseif name ='offer'>
        <#assign modelName = '求职经历'/>
    <#elseif name ='other'>
        <#assign modelName = '其他信息'/>
    <#elseif name ='scholarship'>
        <#assign modelName = '校内奖励'/>
    <#elseif name ='affix'>
        <#assign modelName = '附件/作品'/>
    <#elseif name ='position'>
        <#assign modelName = '校内职务'/>
    </#if>${modelName!""}</#macro>
 